<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			span{
				position: fixed;
				bottom: 50px;
				right: 50px;
				height: 45px;
				width: 45px;
				background: green;
				
			}
		</style>
		<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
		<script type="text/javascript">
			$(function(){
				$("span").click(function(){
					var $page = $("html, body")
					var distance = $("html").scrollTop() + $("body").scrollTop()
					var time = 500
					var intervalTime = 10
					var itemDistance = distance/(time/intervalTime);
					var timer = setInterval(function(){
						distance -= itemDistance
						if(distance <= 0){
							$page.scrollTop(0)
							clearInterval(timer)
						}
						$page.scrollTop(distance)
					}, intervalTime)
				})
			})
		</script>
	</head>
	<body>
		<div style="height: 2000px; width:2000px;"></div>
		<span>
			回到顶部
		</span>
	</body>
</html>
